<%@page import="org.springframework.web.servlet.support.RequestContextUtils"%>
<%@page import="org.springframework.context.ApplicationContext"%>
<%@page import="org.springframework.web.context.support.SpringBeanAutowiringSupport"%>
<%@page import="org.springframework.beans.factory.annotation.Autowired"%>
<%@page import="com.team.app.service.ModelService"%>
<%@page import="com.team.app.service.BrandService"%>
<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

	<script type="text/javascript">
			$(document).ready(function() {
				$("#txtDateGo").datepicker();
				$("#txtDateReturn").datepicker();
				
				$("#dateGo").click(function() {
					$("#txtDateGo").datepicker('show');
				});

				$("#dateReturn").click(function() {
					$("#txtDateReturn").datepicker('show');
				});
				
				$("#btn_search").click(function(){
					if ($("#txtDateGo").val() == "" || $("#txtDateReturn").val() == "")
						{
						   alert("Ngày đi và ngày trả không được để trống.");
						}
					else		
						{
							var pickupDate = $.datepicker.parseDate("mm/dd/yy",  $("#txtDateGo").val());
							var returnDate = $.datepicker.parseDate("mm/dd/yy", $("#txtDateReturn").val());
							var pickupTime = getTime($("#pickup_time").val());
							var returnTime = getTime($("#return_time").val());
							
							pickupDate.setMinutes(pickupTime);
							returnDate.setMinutes(returnTime);
							
							var now = new Date();
							
							if (pickupDate < now)
								{
									alert ("Ngày đi không được nhỏ hơn ngày " +  now );
								}
							else if(returnDate < pickupDate)
								{
									alert ("Ngày trả không được nhỏ hơn ngày đi");
								}
							else
								{
									$("#form_search").submit();
								}
						}
				});
				
				$("#txtDateGo").keydown(function(event){
					 return false;
				});
				
				$("#txtDateReturn").keydown(function(event){
					 return false;
				});
			
			function getTime(time)
			{
				var minutes1 = parseFloat($.trim(time.split(":")[0])) * 60;
				var minutes2 = parseFloat($.trim(time.split(":")[1]));
				return minutes1 + minutes2;				
			};
		}); 
	</script>

<form id="form_search" action="${pageContext.request.contextPath}/search" method="POST">
		<div style="height: 350px; border-radius: 5px; margin-top: 20px; padding-left: 15px; padding-right:15px">
		<div style="margin-top:10px; margin-bottom:20px">ĐẶT THUÊ XE</div>
					<div>
						<table>						
							<tr style="margin-top: 10px">
								<td colspan="2">Ngày đi</td>
							</tr>
							<tr>
								<td><input type="text" style="width:120px" name="pickupDate" class="dateGo" id="txtDateGo"/>
									<img id="dateGo" style="padding-left:7px; padding-right:2px" src="<c:url value="/images/calendar133.png"/> "/>
								</td>
								<td>
									<select id="pickup_time" name="pickup_time" style="width:75px" >
										<c:forEach items="${pickup_time}" var="obj">
											<option>${obj}</option>
										</c:forEach>
									</select>
									<!-- <select id="seTime1">
										<option>123</option>
									</select> -->
								</td>
							</tr>
							<tr style="margin-top: 10px">
								<td colspan="2">Ngày trả</td>
							</tr>
							<tr>
								<td><input type="text" id="txtDateReturn" name="returnDate" style="width: 120px" />
									<img id="dateReturn" style="padding-left:7px; padding-right:2px" src="<c:url value="/images/calendar133.png"/> "/>
								</td>
								<td>
									<select id="return_time" name="return_time" style="width:75px">
										<c:forEach items="${return_time}" var="obj">
											<option>${obj}</option>
										</c:forEach>
									</select>
								</td>
							</tr>
							<tr>
								<td colspan="2">Tỉnh thành:</td>
								
							</tr>
							<tr>
								<td colspan="2">
									<select name="cityId" style="width:210px">
										<c:forEach items="${citys}" var="obj">
											<option value="${obj.cityId}">${obj.cityName}</option>
										</c:forEach>
									</select>
								</td>
							</tr>
							</table>						
							<hr>
							<table>
							<tr>
								<td>Số chỗ</td>
								<td>
								<select name="seat_number" style="width:150px">
									<option>4 - 5</option>
									<option>6 - 9</option>
									<option>10 - 16</option>
									<option>17 - 24</option>
									<option>25 - 35</option>
									<option>36 - 45</option>
								</select>
								</td>
							</tr>
							<tr>
								<td>Hiệu xe:</td>
								<td>
									 <select name="brandId" style="width:150px">
									 	<option value="0">Tất cả</option>
										<c:forEach items="${brands}" var="obj">
											<option value="${obj.brandId}">${obj.brandName}</option>
										</c:forEach>
									</select>
								</td>
							</tr>
							<tr>
								<td>Loại số:</td>
								<td>
									<select name="transmissionType" style="width:150px">
											<option value="0">Tất cả</option>
											<option value="1">Tự động</option>
											<option value="2">Xe số</option>
									</select>
								</td>
							</tr>
						</table>
					</div>
					<div>
						<input id="btn_search" type="button" value="Kiểm tra" style="float: right; margin-right: 10px"/>
					</div>
				</div>

</form>
<div style="clear: both; height: 1px"></div>


